
		
		<?php 

$cs = Yii::app ()->getClientScript (); 
// $cs = Yii::app ()->getClientScript()->registerCoreScript ('jquery'); 
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/jquery-1.7.1.min.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/jquery-ui-1.8.14.custom.min.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.fixedMenu.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/Base.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.opacityrollover.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.galleriffic.js");
$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.history.js");

		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Three.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Clock.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Color.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Edge.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Face3.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Face4.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Geometry.js");

		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Math.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vector2.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vector3.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vector4.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Matrix3.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Matrix4.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Object3D.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Projector.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Quaternion.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Ray.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Rectangle.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Spline.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/UV.js");
		    $cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Frustum.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/core/Vertex.js");

		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/cameras/Camera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/cameras/OrthographicCamera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/cameras/PerspectiveCamera.js");
		
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/Light.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/AmbientLight.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/DirectionalLight.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/PointLight.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/lights/SpotLight.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/Material.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/LineBasicMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshBasicMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshLambertMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshPhongMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshDepthMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshNormalMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshPhongMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshFaceMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/MeshShaderMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ParticleBasicMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ParticleCanvasMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ParticleDOMMaterial.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/materials/ShaderMaterial.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/textures/Texture.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/textures/DataTexture.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Particle.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/ParticleSystem.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Line.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Mesh.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Bone.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/SkinnedMesh.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Ribbon.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/LOD.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/Sprite.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/objects/MorphAnimMesh.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/scenes/Scene.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/scenes/Fog.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/scenes/FogExp2.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/DOMRenderer.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/CanvasRenderer.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/SVGRenderer.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLShaders.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLRenderer.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLRenderTarget.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/WebGLRenderTargetCube.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableVertex.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableFace3.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableFace4.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableObject.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableParticle.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/renderers/renderables/RenderableLine.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/ColorUtils.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/GeometryUtils.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/ImageUtils.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/SceneUtils.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/ShaderUtils.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/animation/AnimationHandler.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/animation/Animation.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/animation/AnimationMorphTarget.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/FirstPersonCamera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/CombinedCamera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/CubeCamera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/PathCamera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/FlyCamera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/RollCamera.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/cameras/TrackballCamera.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/FirstPersonControls2.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/FlyControls.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/PathControls.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/RollControls.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/controls/TrackballControls.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/Curve.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/CurvePath.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/Path.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/Shape.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/TextPath.js"); 
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/core/BufferGeometry.js"); 
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/CubeGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/CylinderGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/ExtrudeGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/IcosahedronGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/LatheGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/OctahedronGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/PlaneGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/SphereGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/TextGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/TorusGeometry.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/geometries/TorusKnotGeometry.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/Loader.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/JSONLoader.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/BinaryLoader.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/ColladaLoader.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/SceneLoader.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/loaders/UTF8Loader.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/modifiers/SubdivisionModifier.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/objects/MarchingCubes.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/plugins/LensFlarePlugin.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/plugins/ShadowMapPlugin.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/plugins/SpritePlugin.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/renderers/AnaglyphWebGLRenderer.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/renderers/CrosseyedWebGLRenderer.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/renderers/ParallaxBarrierWebGLRenderer.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/shaders/ShaderFlares.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/extras/shaders/ShaderSprite.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/RequestAnimationFrame.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/fonts/helvetiker_regular.typeface.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Stats.js");
		
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/jquery.fixedMenu.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/menu/dock.js");
   		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Detector.js");
      	$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/Stats.js");
    	$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/threejs/DAT.GUI.min.js");
 		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/room/HouseNew.js");
		$cs->registerScriptFile(Yii::app ()->request->baseUrl. "/js/room/FacilityNew.js");
		
		
		$cs->registerScript('saveHouseUrl', "saveHouseUrl='".$this->createUrl('/webgl/saveHouse')."';",CClientScript::POS_BEGIN);
		$cs->registerScript('loadHouseUrl', "loadHouseUrl='".$this->createUrl('/webgl/loadHouse')."';",CClientScript::POS_BEGIN);
		
?>


	
	
<div class='buttons'>

</div>

	   <script type="text/javascript">

  jQuery(document).ready(function($) {
      //if ( ! Detector.webgl ) Detector.addGetWebGLMessage();

      var stats;
      var camera, scene, renderer;
      var projector, plane, cube;
      var mouse2D, mouse3D, ray,
      rollOveredFace, isShiftDown = false,
      theta = 45, isCtrlDown = false;

      var rollOverMesh, rollOverMaterial;
      var cubeGeo, cubeMaterial;
      var i, intersector;
      var info;
      var stageWidth,stageHeight;
      var objects=[];
      var centerOffset;
      var rollOverMesh;
	  var stageSize;
	  var house;
	  var gid;
	  var cameraTarget;
	  var facilityInfo;
	  var gui, voxelConfig = {
				orthographicProjection: false
			};
	var voxelPosition = new THREE.Vector3(), tmpVec = new THREE.Vector3();
	
	var fov=100;
	var compass='b';
	var offsetCamera=new THREE.Vector3();
	var clock = new THREE.Clock();
	var initCameraPosition=new THREE.Vector3();
	
	var curFacInfo=null;
      init();
      animate();
    
      function init() {
        //$('#dock').attr('float','left');
        //$('#dock').attr('top','30px');
        //$('#dock').attr('zIndex',100);
        //$('.stage').append($('#dock'));
        
        

        stageWidth=window.innerWidth;
        stageHeight=window.innerHeight;
		stageSize={width:stageWidth,height:stageHeight};
		    
		    // cameraTarget = new THREE.Vector3( 0, 0, 0 );
				// // camera = new THREE.Camera( stageSize.width, stageSize.height, 20, 1, 10000, -2000, 10000 );
				// var aspect = stageWidth / stageHeight;
				// camera = new THREE.Camera( 75, aspect, 1, 100000 );
				// camera.position.y = 800;
				
				var aspect = stageWidth / stageHeight;
				//fov=100;
				camera = new THREE.PerspectiveCamera( fov, aspect, 1, 100000 );
				camera.position.z = 600;
				camera.position.x = 0;
				camera.position.y = 200;
				camera.updateMatrix();
				
				initCameraPosition.z = 600;
				initCameraPosition.x = 0;
				initCameraPosition.y = 200;

        lon=-90;
            controls = new THREE.FirstPersonControls( camera );
		        controls.lookSpeed = 0.0125;
		        controls.movementSpeed = 500;
		        controls.noFly = false;
		        controls.lookVertical = true;
		        controls.constrainVertical = false;
		        controls.verticalMin = 1.5;
		        controls.verticalMax = 2.0;
		        controls.lon = lon;
		        controls.freeze=true;

        scene = new THREE.Scene();

        // // roll-over helpers
// 
       // cursorGeo = new THREE.CubeGeometry( 50, 20, 50 );
       // cursorMaterial = new THREE.MeshBasicMaterial( { color: 0x123456, opacity: 0.5, transparent: true } );
       // cursorMesh = new THREE.Mesh( cursorGeo, cursorMaterial );
       // scene.add( cursorMesh );


        // cubes
        
        //cube2Geo = new THREE.CubeGeometry( 300, 300, 300 );
        //cube2Material = new THREE.MeshLambertMaterial( { color: 0x00ff80, ambient: 0x00ff80, shading: THREE.FlatShading, map: THREE.ImageUtils.loadTexture( "textures/square-outline-textured.png" ) } );
        //cube2Material.color.setHSV( 0.1, 0.7, 1.0 );
        //cube2Material.ambient = cube2Material.color;
        //cube2Mesh = new THREE.Mesh( cube2Geo, cube2Material );
        //cube2Mesh.position.set(300,150,300); 
        //scene.add(cube2Mesh);
        
        
        // picking

        projector = new THREE.Projector();

        // // grid
// 
        // // plane = new THREE.Mesh( new THREE.PlaneGeometry( 1000, 1000, 20, 20 ), new THREE.MeshBasicMaterial( { color: 0x999933, wireframe: true } ) );
        // // plane.rotation.x = - 90 * Math.PI / 180;
        // // plane.name="background";
        // // scene.addObject( plane );
        // planeGeo=new THREE.PlaneGeometry( 2000, 2000, 50, 50 );
        // planeGeo.computeBoundingBox();
		// plane = new THREE.Mesh( new THREE.PlaneGeometry( 2000, 2000, 50, 50 ), new THREE.MeshBasicMaterial( { color: 0x555555, wireframe: true } ) );
		// //plane = new THREE.Mesh( new THREE.Planintersector.object.size 2000, 2000 , 200, 200));
		// // plane.rotation.x = - 90 * Math.PI / 180;
		// plane.name="background";
		// plane.size=planeGeo.boundingBox.max.subSelf(planeGeo.boundingBox.min);
		// scene.add( plane );
		
				planeGeo = new THREE.CubeGeometry( 2000, 2,2000 );
				planeMat=new THREE.MeshBasicMaterial( { color: 0xC0C0C0 } ) ;
				plane=addMesh( planeGeo, 1, 0, -1, 0, 0, 0, 0, planeMat,"background" );
				
				// for(var i=0; i<plane.faceUvs.length; i++) {
					// var uvs = plane.faceUvs[i];
					// for ( j = 0, jl = uvs.length; j < jl; j++ ) {
						// uvs[j].u *= 10;
						// uvs[j].v *= 10;
					// }

				// }
				
		

        mouse2D = new THREE.Vector3( 0, 10000, 0.5 );
        centerOffset=new THREE.Vector3( 0, 0, 0);
        

		// Lights

				var ambientLight = new THREE.AmbientLight( 0x606060 );
				scene.add( ambientLight );

				var directionalLight = new THREE.DirectionalLight( 0xffffff );
				directionalLight.position.set( 1, 0.75, 0.5 ).normalize();
				scene.add( directionalLight );

				renderer = new THREE.WebGLRenderer( { antialias: true, preserveDrawingBuffer : true } );
				renderer.setSize( window.innerWidth, window.innerHeight );

        		$('.stage').append( $(renderer.domElement) );



        
        stats = new Stats();
        stats.domElement.style.position = 'absolute';
        stats.domElement.style.top = '30px';
        $('.stage').append( $(stats.domElement) );
        
/*
				// add GUI
				gui = new DAT.GUI();
				gui.add(voxelConfig, 'orthographicProjection').onChange(function(){
				
					if ( voxelConfig.orthographicProjection ) {
						camera.toOrthographic();
						camera.position.x = 1000;
				               			camera.position.y = 707.106;
				                		camera.position.z = 1000;
						theta = 90;
					} else {
						camera.toPerspective();
						camera.position.y = 800;
					}
				
				});
				gui.close();
 */       
        //$('.stage canvas').bind('mousemove',function(event){move(event);}); 
        $(this).bind('keydown',function(event){
							switch( event.keyCode ) {

					case 16: isShiftDown = !isShiftDown; break;
					case 17: isCtrlDown = !isCtrlDown; break;

				}
		});

      }

			function addMesh( geometry, scale, x, y, z, rx, ry, rz, material,name ) {

				geometry.computeBoundingBox();
				mesh = new THREE.Mesh( geometry, material );
				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
				mesh.position.x = x;
				mesh.position.y = y;
				mesh.position.z = z;
				mesh.rotation.x = rx;
				mesh.rotation.y = ry;
				mesh.rotation.z = rz;
				mesh.overdraw = true;
				mesh.doubleSided = false;
				mesh.name=name;
				mesh.size=geometry.boundingBox.max.subSelf(geometry.boundingBox.min);
				mesh.updateMatrix();


				scene.add(mesh);
				
				return mesh;
			
			}
			
      //

      function animate() {

        requestAnimationFrame( animate );

        render();
        stats.update();

      }

      function render() {

				if(house){
				  if(house.facilityMoveFlg)
              house.setFacilityCoordinate(plane,scene,camera);
				}


				
				var delta = clock.getDelta();
				controls.around( delta );

				renderer.render( scene, camera );

      }


			function getRealIntersector( intersects ) {

				for( i = 0; i < intersects.length; i++ ) {

					intersector = intersects[ i ];

					if ( intersector.object != plane&&intersector.object != facility.cursorMesh ) {

						return intersector;

					}

				}

				return null;

			}
			
		function setVoxelPosition( intersector ) {

				tmpVec.copy( intersector.face.normal );

				voxelPosition.add( intersector.point, intersector.object.matrixRotationWorld.multiplyVector3( tmpVec ) );

				voxelPosition.x = Math.floor( voxelPosition.x / 50 ) * 50 + 25;
				voxelPosition.y = Math.floor( voxelPosition.y / 50 ) * 50 + 25;
				voxelPosition.z = Math.floor( voxelPosition.z / 50 ) * 50 + 25;
				// console.log(voxelPosition.x+","+voxelPosition.y+","+voxelPosition.z+";");
			}
    buildHouse=function(hsId,roomStyles){
    	
    	house=new House(camera,scene);
    	// house.build(hsId,roomStyles);
		house.loadHouseStyle(hsId,roomStyles);
      
    }
	loadHouse=function(h){

		// for(i in objects){
			// scene.removeObject(objects[i]);
		// }
		// scene.add( plane );
		while(scene.getChildByName('fac')||scene.getChildByName('wall')||scene.getChildByName('floor')){
				scene.remove(scene.getChildByName('fac'));
				scene.remove(scene.getChildByName('wall'));
				scene.remove(scene.getChildByName('floor'));
		}
		
		house=new House(camera,scene);
		house.load(h);
		$('.stage canvas').bind('click',function(event){getFocus(event,plane);}); 
		// $('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
		// alert(h);
		
	};
    
	quoteMesh=function(goodsGeo,event){   
			event.preventDefault();
			house.addFacility(goodsGeo,scene);
			
			// facility.createMesh(goodsGeo,scene);

			$('.stage canvas').unbind('click');
			showButtons(event);
			// $('.stage canvas').bind('mousemove',{stageSize:stageSize,plane:plane},move); 
			// $('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
      	}
			
			var move=function(event){
				event.preventDefault();
				mouse2D.x = ( event.clientX / stageSize.width ) * 2 - 1;
				mouse2D.y = - ( event.clientY / stageSize.height ) * 2 + 1;
				if(house)
				house.moveFacility(mouse2D,plane,scene,camera);
				// facility.move(event);
			};
      
      var getFocus=function(event){
        event.preventDefault();
    		mouse2D.x = ( event.clientX / stageSize.width ) * 2 - 1;
    		mouse2D.y = - ( event.clientY / stageSize.height ) * 2 + 1;
    		if(house.getFacility(mouse2D,plane)){
    			curFacInfo=house.houseGoodsInfo;
    			house.houseGoodsInfo=null;
    		    $('.stage canvas').unbind('click');
    		    showButtons(event);	
    		}

      };

		var locate=function(event){
        // facility.isCollided(event);
        if(house){

    				if(house.releaseFacility()){
    				    $('.stage canvas').unbind('mousemove');
		                $('.stage canvas').unbind('click');
		                $('.stage canvas').bind('click',function(event){getFocus(event,plane);}); 
    				};
    				//$('.stage canvas').bind('mousemove',function(event){move(event);}); 
    				
		    }
	};

  var rotate=function(event){
  	
      facility.rotate(event);
  };
			


	var saveHouse=function(saveHouseUrl){
		house?house.save(saveHouseUrl):alert("please load house style first");
		
	};
	
	$('#save').click(function(){
	 //alert(saveHouseUrl);
		saveHouse(saveHouseUrl);
	});
	
	$('#load').click(function(){
   //alert(loadHouseUrl);
    loadHouse(loadHouseUrl);
  });
			

/**
 * move Ctrl
 */
        $('.Move_f').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -44px");
        }).mousedown(function(){
            //alert('mousedown');
            controls.freeze=false;
            controls.moveForward = true;
        });
        $('.Move_r').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -88px");
        }).mousedown(function(){
            controls.freeze=false;
            controls.moveRight = true;
        });
        $('.Move_b').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -132px");
        }).mousedown(function(){
            controls.freeze=false;
            controls.moveBackward = true;
        });
        $('.Move_l').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -176px");
        }).mousedown(function(){          
            controls.freeze=false;
            controls.moveLeft = true;
        });

        
        $('.rotate_l').mouseenter( function() {
        }).mousedown(function(){          
            controls.freeze=false;
            controls.rotateLeft = true;
        });

        $('.rotate_r').mouseenter( function() {
        }).mousedown(function(){          
            controls.freeze=false;
            controls.rotateRight = true;
        });
                
        $('.rotate').mouseup(function(){
            controls.freeze=true;
            
            controls.moveForward = false;
            controls.moveRight = false;
            controls.moveBackward = false;
            controls.moveLeft = false;
                        
            controls.rotateLeft = false;
            controls.rotateRight = false;
            
            controls.lookUp = false;
            controls.lookRight = false;
            controls.lookDown = false;
            controls.lookLeft = false;
            controls.constrainVertical = true;
        }); 
        
        
        $('.Look_u').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -44px");
        }).mousedown(function(){
            //alert('mousedown');
            controls.freeze=false;
            controls.lookUp = true;
        });
        $('.Look_r').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -88px");
        }).mousedown(function(){
            controls.freeze=false;
            controls.lookRight = true;
        });
        $('.Look_d').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -132px");
        }).mousedown(function(){
            controls.freeze=false;
            controls.lookDown = true;
        });
        $('.Look_l').mouseenter( function() {
           $('.BMap_stdMpPan').css('background-position',"0px -176px");
        }).mousedown(function(){          
            controls.freeze=false;
            controls.lookLeft = true;
        });
        
        $('.BMap_button').mouseleave( function() {
          $('.BMap_stdMpPan').css('background-position',"0px 0px");
        }).mouseup(function(){
            controls.freeze=true;
            
            controls.moveForward = false;
            controls.moveRight = false;
            controls.moveBackward = false;
            controls.moveLeft = false;
            
            controls.rotateLeft = false;
            controls.rotateRight = false;
            
            controls.lookUp = false;
            controls.lookRight = false;
            controls.lookDown = false;
            controls.lookLeft = false;
            //controls.lon=-110;
            lon=controls.lon;
            
        });
             
        
        /**
         * coompass
         */
		var props = 'transform WebkitTransform MozTransform OTransform msTransform'.split(' '),
			prop,
			el = document.createElement('div');
		
		for(var i = 0, l = props.length; i < l; i++) {
			if(typeof el.style[props[i]] !== "undefined") {
				prop = props[i];
				break;
			}
		}
		document.getElementById('cube').style[prop] = "rotateX(-30deg) rotateY(-30deg) ";
		/*		//$('#cube').css(prop,"rotateX(-30deg) rotateY(-30deg) ");
		var xAngle = 0, yAngle = 0;
		$('body').keydown(function(evt) {
			switch(evt.keyCode) {
				case 37: // left
					yAngle -= 90;
					break;
				
				case 38: // up
					xAngle += 90;				
					break;
				
				case 39: // right
					yAngle += 90;
					break;
					
				case 40: // down
					xAngle -= 90;
					break;
			};
			 document.getElementById('cube').style[prop] = "rotateX("+xAngle+"deg) rotateY("+yAngle+"deg)";
			//$('#cube').css(prop,"rotateX("+xAngle+"deg) rotateY("+yAngle+"deg)");
		});	
		*/
		$('.face').click(function(evt) {
			switch($(this).attr('id')){
				case 'faceUp':
					xAngle=-120;
					yAngle=0;
					compass='u';
					break;
				case 'faceDown':
					xAngle=-300;
					compass='d';
					break;	
				case 'faceFront':
					xAngle=-30;
					yAngle=-210;
					controls.freeze=false;
					// controls.moveLeft = true;
					// controls.moveForward = true;
					
					compass='f';
					break;	
				case 'faceBack':
					xAngle=-30;
					yAngle=-30;
					compass='b';
					break;		
				case 'faceRight':
					xAngle=-30;
					yAngle=-120;
					compass='r';
					break;	
				case 'faceLeft':
					xAngle=-30;
					yAngle=-300;
					compass='l';
					break;	
			};
			
			document.getElementById('cube').style[prop] = "rotateX("+xAngle+"deg) rotateY("+yAngle+"deg)";
		});	

        /**
         * toolbar
         */
        $( "#slider-vertical" ).slider({
          orientation: "vertical",
          range: "min",
          min: 0,
          max: 100,
          value: fov,
          slide: function( event, ui ) {
           // $( "#amount" ).val( ui.value );
           //alert(ui.value);
           fov=100-ui.value;
          }
        });

        /**
         * popmenu
         */
var showButtons= function (event) {

	$('.stage canvas').unbind('mousemove');
	

	
	$('.pop').show();
	
	if(curFacInfo.name=='wall'){
	 $('.wallmenu').show();
	}else{
	 $('.opmenu').show();
	}
	// $('.stage canvas').click(function(){
  		// $( ".pop" ).hide();
  	// });
	// position: relative; display: block; left: 1054px; top: -765px;
	$('.pop').css({left:event.clientX,top:event.clientY});

			$("#move").click(function(){
  				$('.stage canvas').bind('mousemove',{stageSize:stageSize,plane:plane},move);
  				$('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
  				$('.pop').hide();
			});
			$("#rotate").click(function(){
  				$('.stage canvas').bind('mousemove',{curmouse:{x:event.clientX,y:event.clientY}},rotate);
  				$('.stage canvas').bind('click',{stageSize:stageSize,objects:objects},locate);
  				$('.pop').hide();
			});
			
			$('.info').click(function(){
				// alert(house.facility.facMesh.name);
				//alert($('.popmenu').position().left);
				$('#goodsName').html(curFacInfo.goodsName);
				$('#description').html(curFacInfo.description);
				$(".facilityInfo").show();
				$('.opmenu').hide();
			});
	};
		

});


		</script>
	
<div class='stage'>

</div>
<?php include  dirname(__FILE__).'/toolbar.php';?> 
<?php include  dirname(__FILE__).'/moveCtrl.php';?>
<?php include  dirname(__FILE__).'/popmenu.php';?>
<div class='house'></div>